<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户注册</title>
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/register.css">
<script src="js/register.js" type="module" charset="utf-8"></script>
</head>
<body>
	<section>
		<aside class="img_box"></aside>
		<h1 style="text-align: center; margin-top: 30px;">用户注册</h1>
		<fieldset>
			<legend hidden>用户注册</legend>
			<form action="user.servlet?param=doRegister" method="POST"
				id="myForm">
				<table>
					<tbody>
						<tr>
							<td><label for="userName">用户名：</label></td>
							<td><input type="text" name="userName" required
								id="userName"></td>
							<td>
								<nav class="error_block">
									<div class="userName_error_img"></div>
									<div class="userName_error_msg"></div>
								</nav>
							</td>
						</tr>
						<tr>
							<td><label for="nickName">昵称：</label></td>
							<td><input type="text" name="nickName" id="nickName"></td>
							<td>
								<nav class="error_block">
									<div class="nickName_error_img"></div>
									<div class="nickName_error_msg"></div>
								</nav>
							</td>
						</tr>
						<tr>
							<td><label for="userName">密码：</label></td>
							<td><input type="password" name="password" id="password"></td>
							<td>
								<nav class="error_block">
									<div class="password_error_img"></div>
									<div class="password_error_msg"></div>
								</nav>
							</td>
						</tr>
						<tr>
							<td><label for="rePassword">再输入一次：</label></td>
							<td><input type="password" name="rePassword" id="rePassword"></td>
							<td>
								<nav class="error_block">
									<div class="rePassword_error_img"></div>
									<div class="rePassword_error_msg"></div>
								</nav>
							</td>
						</tr>
						<tr>
							<td><label for="userName">email：</label></td>
							<td><input type="email" name="email" id="email"></td>
							<td>
								<nav class="error_block">
									<div class="email_error_img"></div>
									<div class="email_error_msg"></div>
								</nav>
							</td>
						</tr>
						<tr>
							<td><label for="phone">手机号：</label></td>
							<td><input type="text" name="phone" id="phone"></td>
							<td>
								<nav class="error_block">
									<div class="phone_error_img"></div>
									<div class="phone_error_msg"></div>
								</nav>
							</td>
						</tr>
						<tr>
							<td>性别：</td>
							<td colspan="2"><input type="radio" name="sex" value="1"
								id="man"> <label for="man">男</label>&nbsp; <input
								type="radio" name="sex" value="2" id="woman"> <label
								for="woman">女</label></td>
						</tr>
						<tr>
							<td>爱好：</td>
							<td colspan="2">
								<table>
									<tr>
										<c:forEach items="${requestScope.hobbies}" var="hobby"
											varStatus="status">
											<td><input type="checkbox" name="fav"
												id="hobby_${hobby.code}" value="${hobby.code}" /> <label
												for="hobby_${hobby.code}">${hobby.name}</label>
											<td><c:if test="${(status.index+1)%4==0}">
									</tr>
									<tr>
										</c:if>
										</c:forEach>
									</tr>
								</table>
							</td>
						</tr>
						<tr>
							<td>来自于：</td>
							<td colspan="2"><select id="selProvince">
									<c:forEach items="${requestScope.provinces}" var="province">
										<option value="${province.code}">${province.name}</option>
									</c:forEach>
							</select>&nbsp;&nbsp;&nbsp;&nbsp; <select id="selCity" name="cityCode"></select>
							</td>
						</tr>
						<tr>
							<td>照片：</td>
							<td colspan="2"><input type="file" name="photo"
								accept="image/*"></td>
						</tr>
						<tr>
							<td>生日：</td>
							<td colspan="2"><input type="date" name="birthday">
							</td>
						</tr>
					</tbody>
				</table>
				<nav style="text-align: center; margin-top: 30px;">
					<button type="reset" class="normal_button">重置</button>
					&nbsp;&nbsp;
					<button type="submit" class="normal_button">注册</button>
				</nav>
			</form>
		</fieldset>
	</section>
</body>

</html>